import React from 'react';
import Title from './title';
import { useHistory } from 'react-router';
import Lazyload from 'react-lazyload'; 
import style from './NewGoods.module.scss';
interface Iprops {
    newGoodsList: Array<object>,
    titleFlag: boolean
}
const NewGoods: React.FC<Iprops> = props => {
    const history = useHistory();
    return <div className={style.newGoods}>
        {
            props.titleFlag 
            ?
            <Title title="新品首发" background="none" />
            :
            null
        }
        <div className={style.wrap}>
            {
                props.newGoodsList&&props.newGoodsList.map((item: any) => {
                    return <dl
                        className={style.item}
                        key={item.id}
                        onClick={() => history.push(`/addcart/${item.id}`)}
                    >
                        <dt>
                            <Lazyload overflow={true}>
                                <img src={item.list_pic_url} alt="" />
                            </Lazyload>
                        </dt>
                        <dd>{item.name}</dd>
                        <dd><b>￥ {item.retail_price}</b></dd>
                    </dl>
                })
            }
        </div>
    </div>
}

export default NewGoods